<script setup lang="ts">
/**
 * @see {@link https://vuejs.org/api/sfc-script-setup.html#defineoptions}
 */
defineOptions({
	name: "TMallBill",
	inheritAttrs: false,
});
import {
	getBillColumnPage,
	downloadTemplateApi,
	importBillColumn,
} from "@/api/dyBill";

import {DyBillQuery, DyBillPageVO} from "@/api/dyBill/types";

const queryFormRef = ref(ElForm); // 查询表单

const loading = ref(false);
const ids = ref([]);
const total = ref(0);
const monthValue = ref('')

const queryParams = reactive<DyBillQuery>({
	pageNum: 1,
	pageSize: 10,
});
const billColumnList = ref<DyBillPageVO[]>();



/**
 * 查询
 */
function handleQuery() {
	queryParams.billMonth = monthValue.value
	loading.value = true;
	getBillColumnPage(queryParams)
	.then(({data}) => {
		billColumnList.value = data.list;
		total.value = data.total;
	})
	.finally(() => {
		loading.value = false;
	});
}

/** 重置查询 */
function resetQuery() {
	queryParams.pageNum = 1;
	handleQuery();
}

onMounted(() => {
	let now = new Date()
	let month = now.getMonth()
	if (month < 9){
		monthValue.value = now.getFullYear() + '0' + (now.getMonth() + 1) + ''
	}	else {
		monthValue.value = now.getFullYear() + '' + (now.getMonth() + 1) + ''
	}
	handleQuery(); // 初始化标准账单配置列表数据
});
</script>

<template>
	<div class="app-container">
		<el-row :gutter="20">
			<el-col>
				<div class="search-container">
				  <el-form ref="queryFormRef" :model="queryParams" :inline="true">
					  <el-form-item label="账单月份">
						  <el-date-picker
								  v-model="monthValue"
								  type="month"
								  value-format="YYYYMM"
								  :editable="false"
								  :clearable="false"
								  placeholder="选择月份"
						  />
					  </el-form-item>
					<el-form-item label="订单号" prop="keywords">
					  <el-input
						v-model="queryParams.keywords"
						placeholder="请输入订单号"
						clearable
						style="width: 200px"
						@keyup.enter="handleQuery"
					  />
					</el-form-item>
					  <el-form-item label="子订单号" prop="subOrderNo">
						  <el-input
								  v-model="queryParams.subOrderNo"
								  placeholder="请输入子订单号"
								  clearable
								  style="width: 200px"
								  @keyup.enter="handleQuery"
						  />
					  </el-form-item>
					  <el-form-item label="结算单类型" prop="settlementType">
						  <dictionary v-model="queryParams.settlementType" type-code="settlementType" />
					  </el-form-item>
					<el-form-item>
					  <el-button type="primary" @click="resetQuery"
						><i-ep-search />搜索</el-button
					  >
					  <el-button @click="resetQuery">
						<i-ep-refresh />
						重置</el-button
					  >
					</el-form-item>
				  </el-form>
				</div>

				<el-card shadow="never">

					<el-table
				  		size="small"
			  			:height="billColumnList && billColumnList.length > 0 ? 650 : 150"
							v-loading="loading"
							:data="billColumnList"
							border
					>
						<el-table-column
								label="结算时间"
								align="center" show-overflow-tooltip
								prop="settlementTime"
								width="180"
						/>
						<el-table-column
								label="订单号"
								width="180"
								align="center" show-overflow-tooltip
								prop="orderNo"
						/>
						<el-table-column
								label="子订单号"
								width="180"
								align="center" show-overflow-tooltip
								prop="subOrderNo"
						/>

						<el-table-column
								label="结算金额"
								width="100"
								align="center" show-overflow-tooltip
								prop="settlementPrice"
						/>

						<el-table-column
								label="结算账户"
								width="120"
								align="center" show-overflow-tooltip
								prop="settlementAccount"
						/>
						<el-table-column
								label="结算单类型"
								align="center" show-overflow-tooltip
								prop="settlementType"
								width="180"
						/>
						<el-table-column
								label="有结算前退款"
								align="center" show-overflow-tooltip
								prop="settlementRefund"
								width="180"
						></el-table-column>
						<el-table-column
								label="下单时间"
								align="center" show-overflow-tooltip
								prop="orderTime"
								width="180"
						></el-table-column>
						<el-table-column
								label="商品ID"
								align="center" show-overflow-tooltip
								prop="productId"
								width="180"
						></el-table-column>
						<el-table-column
								label="商品数量"
								align="center" show-overflow-tooltip
								prop="quantity"
								width="120"
						></el-table-column>
						<el-table-column
								label="业务类型"
								align="center" show-overflow-tooltip
								prop="businessType"
								width="180"
						></el-table-column>
						<el-table-column
								label="订单类型"
								align="center" show-overflow-tooltip
								prop="orderType"
								width="180"
						></el-table-column>
						<el-table-column
								label="订单总价"
								align="center" show-overflow-tooltip
								prop="orderAmount"
								width="180"
						></el-table-column>
						<el-table-column
								label="商品总价"
								align="center" show-overflow-tooltip
								prop="productAmount"
								width="180"
						></el-table-column>
						<el-table-column
								label="运费"
								align="center" show-overflow-tooltip
								prop="transportFee"
								width="180"
						></el-table-column>
						<el-table-column
								label="店铺劵"
								align="center" show-overflow-tooltip
								prop="preferential"
								width="180"
						></el-table-column>
						<el-table-column
								label="结算前退款金额"
								align="center" show-overflow-tooltip
								prop="settlementRefundAmount"
								width="180"
						></el-table-column>
						<el-table-column
								label="平台补贴"
								align="center" show-overflow-tooltip
								prop="preformSubsidy"
								width="180"
						></el-table-column>
						<el-table-column
								label="达人补贴"
								align="center" show-overflow-tooltip
								prop="drSubsidy"
								width="180"
						></el-table-column>
						<el-table-column
								label="支付补贴"
								align="center" show-overflow-tooltip
								prop="dySubsidy"
								width="180"
						></el-table-column>
						<el-table-column
								label="月付营销补贴"
								align="center" show-overflow-tooltip
								prop="dyMonthSubsidy"
								width="180"
						></el-table-column>
						<el-table-column
								label="用户实付"
								align="center" show-overflow-tooltip
								prop="buyAmount"
								width="180"
						></el-table-column>
						<el-table-column
								label="收入合计"
								align="center" show-overflow-tooltip
								prop="reiceveAmount"
								width="180"
						></el-table-column>
						<el-table-column
								label="平台服务费"
								align="center" show-overflow-tooltip
								prop="serviceAmount"
								width="180"
						></el-table-column>
						<el-table-column
								label="佣金"
								align="center" show-overflow-tooltip
								prop="commission"
								width="180"
						></el-table-column>
						<el-table-column
								label="渠道分成"
								align="center" show-overflow-tooltip
								prop="channelFee"
								width="180"
						></el-table-column>
						<el-table-column
								label="招商服务费"
								align="center" show-overflow-tooltip
								prop="investmentServiceFee"
								width="180"
						></el-table-column>
						<el-table-column
								label="站外推广费"
								align="center" show-overflow-tooltip
								prop="promotionFee"
								width="180"
						></el-table-column>
						<el-table-column
								label="其他分成"
								align="center" show-overflow-tooltip
								prop="otherFee"
								width="180"
						></el-table-column>
						<el-table-column
								label="其他分成说明"
								align="center" show-overflow-tooltip
								prop="otherFeeRemark"
								width="180"
						></el-table-column>
						<el-table-column
								label="支出合计"
								align="center" show-overflow-tooltip
								prop="payAmount"
								width="180"
						></el-table-column>
						<el-table-column
								label="是否免佣"
								align="center" show-overflow-tooltip
								prop="noCommission"
								width="180"
						></el-table-column>
						<el-table-column
								label="免佣金额"
								align="center" show-overflow-tooltip
								prop="noCommissionAmount"
								width="180"
						></el-table-column>
						<el-table-column
								label="备注"
								align="center" show-overflow-tooltip
								prop="remark"
								width="180"
						></el-table-column>
					</el-table>

					<pagination
							v-if="total > 0"
							v-model:total="total"
							v-model:page="queryParams.pageNum"
							v-model:limit="queryParams.pageSize"
							@pagination="handleQuery"
					/>
				</el-card>
			</el-col>
		</el-row>
	</div>
</template>
